import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../../../../common/models/video/index.dart';

class VideoInfoOverlay extends StatelessWidget {
  final VideoItem video;
  final VoidCallback onLikeTap;
  final VoidCallback onCommentTap;
  final VoidCallback onShareTap;

  const VideoInfoOverlay({
    super.key,
    required this.video,
    required this.onLikeTap,
    required this.onCommentTap,
    required this.onShareTap,
  });

  String _formatCount(int? count) {
    if (count == null) return '0';
    if (count >= 10000) {
      return '${(count / 10000).toStringAsFixed(1)}w';
    }
    return count.toString();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        // 底部信息区域
        Positioned(
          left: 12.w,
          right: 80.w,
          bottom: 20.h,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // 作者信息
              if (video.author != null)
                Row(
                  children: [
                    // 用户头像（使用网络图片）
                    Container(
                      width: 48.w,
                      height: 48.h,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        border: Border.all(
                          color: Colors.white,
                          width: 2,
                        ),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.black26,
                            blurRadius: 8.r,
                            offset: Offset(0, 2.h),
                          ),
                        ],
                      ),
                      child: ClipOval(
                        child: video.avatarUrl != null
                            ? Image.network(
                                video.avatarUrl!,
                                fit: BoxFit.cover,
                                errorBuilder: (context, error, stackTrace) {
                                  return Container(
                                    color: Colors.grey[300],
                                    child: Icon(
                                      Icons.person,
                                      color: Colors.grey,
                                      size: 28.r,
                                    ),
                                  );
                                },
                                loadingBuilder: (context, child, loadingProgress) {
                                  if (loadingProgress == null) return child;
                                  return Container(
                                    color: Colors.grey[300],
                                    child: const Center(
                                      child: CircularProgressIndicator(
                                        strokeWidth: 2,
                                        color: Colors.white,
                                      ),
                                    ),
                                  );
                                },
                              )
                            : Container(
                                color: Colors.grey[300],
                                child: Icon(
                                  Icons.person,
                                  color: Colors.grey,
                                  size: 28.r,
                                ),
                              ),
                      ),
                    ),
                    SizedBox(width: 12.w),
                    Expanded(
                      child: Text(
                        video.author!,
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 16.sp,
                          fontWeight: FontWeight.bold,
                          shadows: [
                            Shadow(
                              color: Colors.black54,
                              blurRadius: 5.r,
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              SizedBox(height: 12.h),
              // 视频标题
              if (video.title != null)
                Text(
                  video.title!,
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 15.sp,
                    height: 1.4,
                    shadows: [
                      Shadow(
                        color: Colors.black54,
                        blurRadius: 5.r,
                      ),
                    ],
                  ),
                ),
            ],
          ),
        ),

        // 右侧操作按钮 - 抖音风格
        Positioned(
          right: 12.w,
          bottom: 100.h,
          child: Column(
            children: [
              // 点赞按钮
              _buildActionButton(
                icon: Icons.favorite,
                count: video.likeCount,
                isActive: false,
                onTap: onLikeTap,
              ),
              SizedBox(height: 28.h),
              // 评论按钮
              _buildActionButton(
                icon: Icons.mode_comment,
                count: video.commentCount,
                onTap: onCommentTap,
              ),
              SizedBox(height: 28.h),
              // 分享按钮
              _buildActionButton(
                icon: Icons.share,
                count: video.shareCount,
                onTap: onShareTap,
              ),
            ],
          ),
        ),
      ],
    );
  }

  /// 构建抖音风格的操作按钮
  Widget _buildActionButton({
    required IconData icon,
    int? count,
    bool isActive = false,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Column(
        children: [
          // 图标
          Icon(
            icon,
            color: Colors.white,
            size: 36.r,
            shadows: [
              Shadow(
                color: Colors.black45,
                blurRadius: 8.r,
                offset: Offset(0, 2.h),
              ),
            ],
          ),
          // 数字
          if (count != null) ...[
            SizedBox(height: 4.h),
            Text(
              _formatCount(count),
              style: TextStyle(
                color: Colors.white,
                fontSize: 12.sp,
                fontWeight: FontWeight.w600,
                shadows: [
                  Shadow(
                    color: Colors.black45,
                    blurRadius: 4.r,
                    offset: Offset(0, 1.h),
                  ),
                ],
              ),
            ),
          ],
        ],
      ),
    );
  }
}
